<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>蒋中英个人博客</title>
<meta name="keywords" content="个人博客,蒋中英" />
<meta name="description" content="中英个人博客，开源技术分享." />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="/yangqq/css/base.css" rel="stylesheet">
<link href="/yangqq/css/index.css" rel="stylesheet">
<link href="/yangqq/css/m.css" rel="stylesheet">
<link href="/yangqq/css/pagination.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js" type="text/javascript"></script>
<script src="/yangqq/js/jquery.easyfader.min.js"></script>
<script src="/yangqq/js/scrollReveal.js"></script>
<script src="/yangqq/js/jquery.pagination.js"></script>
<script src="/yangqq/js/common.js"></script>
<!--[if lt IE 9]>
<script src="/yangqq/js/modernizr.js"></script>
<![endif]-->
</head>
<body>
<header> 
  <!--menu begin-->
  <div class="menu" th:insert="common/html/front::header"></div>
  <!--menu end-->
  <div id="mnav" th:include="common/html/front::mnav"></div>
</header>
<article> 
  <!--banner begin-->
 <div class="picsbox" th:if="${header.size() != 0}">
  <div class="banner">
    <div id="banner" class="fader">
      <li class="slide" th:if="${header.size() > 0}"><a th:href="'/detail/' + ${header[0].id}" target="_blank"><img th:src="${#strings.arraySplit(header[0].photo, ';')[0]}"><span class="imginfo" th:text="${header[0].title}">别让这些闹心的套路，毁了你的网页设计!</span></a></li>
      <li class="slide" th:if="${header.size() > 1}"><a th:href="'/detail/' + ${header[1].id}" target="_blank"><img th:src="${#strings.arraySplit(header[1].photo, ';')[0]}"><span class="imginfo" th:text="${header[1].title}">别让这些闹心的套路，毁了你的网页设计!</span></a></li>
      <li class="slide" th:if="${header.size() > 2}"><a th:href="'/detail/' + ${header[2].id}" target="_blank"><img th:src="${#strings.arraySplit(header[2].photo, ';')[0]}"><span class="imginfo" th:text="${header[2].title}">别让这些闹心的套路，毁了你的网页设计!</span></a></li>
      <div class="fader_controls">
        <div class="page prev" data-target="prev">&lsaquo;</div>
        <div class="page next" data-target="next">&rsaquo;</div>
        <ul class="pager_list">
        </ul>
      </div>
    </div>
  </div>
  <!--banner end-->
  <div class="toppic">
    <li th:if="${header.size() > 3}"> <a th:href="'/detail/' + ${header[3].id}" target="_blank"> <i><img th:src="${#strings.arraySplit(header[3].photo, ';')[0]}"></i>
      <h2 th:text="${header[3].title}">别让这些闹心的套路，毁了你的网页设计!</h2>
      <span th:text="${header[3].blogCategory.categoryName}">学无止境</span> </a> </li>
    <li th:if="${header.size() > 4}"> <a th:href="'/detail/' + ${header[4].id}" target="_blank"> <i><img th:src="${#strings.arraySplit(header[4].photo, ';')[0]}"></i>
      <h2 th:text="${header[4].title}">别让这些闹心的套路，毁了你的网页设计!</h2>
      <span th:text="${header[4].blogCategory.categoryName}">学无止境</span> </a> </li>
  </div>
  </div>
  <div class="blank"></div>
  <!--blogsbox begin-->
  <div class="blogsbox">
    <div class="blogs" data-scroll-reveal="enter bottom over 1s" th:each="article,status: ${articleList}">
      <h3 class="blogtitle"><a th:href="'/detail/' + ${article.id}" target="_blank" th:text="${article.title}"></a></h3>
      <span th:class="${#arrays.length(#strings.arraySplit(article.photo, ';')) == 1}?(${status.even}?'blogpic':'bigpic'):'bplist'"><a th:href="'/detail/' + ${article.id}" target="_blank"><li th:each="var: ${#strings.arraySplit(article.photo, ';')}"><img th:src="${var}" alt=""></li></a></span>
      <p class="blogtext" th:utext="${article.description}"></p>
      <div class="bloginfo">
        <ul>
          <li class="author"><a href="/">蒋中英</a></li>
          <li class="lmname"><a href="/" th:text="${article.blogCategory.categoryName}"></a></li>
          <li class="timer" th:text="${article.datePublish != null}?${#dates.format(article.datePublish, 'yyyy-MM-dd')}:'null'"></li>
          <li class="view"><span th:text="${article.clickCount}"></span>已阅读</li>
          <!--<li class="like"  th:text="${}">9999</li>-->
        </ul>
      </div>
    </div>
    <div id="page" class="pagination"></div>
  </div>
  <!--blogsbox end-->
  <div class="sidebar" th:include="common/html/front::sidebar"></div>
</article>
<footer th:insert="common/html/front::footer"></footer>
<script th:inline="javascript">
  function getOptionsFromForm(){
    var opt = {callback: function pageselectCallback(){}};
    opt.current_page = [[${page.pageNum}]] - 1;
    opt.items_per_page = [[${page.pageSize}]];
    opt.num_display_entries = 4;
    opt.num_edge_entries = 1;
    opt.prev_text = "上一页";
    opt.next_text = "下一页";
    opt.link_to = "/index/__id__";
    opt.prev_show_always = false;
    opt.next_show_always = false;
    return opt;
  }

  $("#page").pagination([[${page.total}]], getOptionsFromForm());
</script>
<a href="#" class="cd-top">Top</a>
</body>
</html>
